<template>
  <a-spin :spinning="spinning">
    <div class="main">
      <a-card title="基础信息" :loading="loading">
        <template #extra>
          <a-button type="primary" @click="toCopy" v-if="auth.includes('acc_edit_copy')">复制</a-button>
          <a-button type="primary" @click="onSubmit" :disabled="disabled" v-if="auth.includes('acc_edit_save')"
            style="margin-left:10px">保存</a-button>
          <a-button type="primary" @click="toPrint" :disabled="disabled" v-if="auth.includes('acc_edit_save')"
            style="margin-left:10px">打印</a-button>
        </template>
        <a-form-model :model="form" labelAlign="right" :rules="rules" ref="ruleForm" :labelCol="{ span: 6 }"
          :wrapperCol="{ span: 18 }">
          <a-row v-if="form.accId && !ifCopy">
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" :xxl="24">
              <a-form-model-item label="辅料编号" prop="code" :labelCol="{ span: 2 }" :wrapperCol="{ span: 22 }">
                {{ form.code }}
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="辅料大类" prop="classifyBig">
                <a-select v-model="form.classifyBig" placeholder="请选择辅料大类" style="width:100%" @change="changeBig"
                  @focus="getDictChildList('CLASSIFY_BIG', 'classifyBigList')" allow-clear>
                  <a-select-option v-for="(item) in classifyBigList" :key="item.code" :value="item.code">
                    {{ item.code }}-{{ item.name }}
                  </a-select-option>
                </a-select>
                <!-- <a-select
                  v-else
                  allow-clear
                  v-model="form.classifyBig"
                  placeholder="请选择辅料大类"
                  @focus="getDictChildList('CLASSIFY_BIG', 'classifyBigList')"
                  style="width:100%"
                  @change="changeBig"
                >
                  <a-select-option
                    :key="form.classifyBig"
                    :value="form.classifyBig"
                  >
                    {{ form.classifyBig }}-{{ form.classifyBigValue }}
                  </a-select-option>
                </a-select> -->
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="辅料中类" prop="classifySmall">
                <a-select allow-clear v-model="form.classifySmall" placeholder="请选择辅料中类" style="width:100%"
                  @change="changeSmall">
                  <a-select-option v-for="(item) in classifySmallList" :key="item.code" :value="item.code">
                    {{ item.code }}-{{ item.name }}
                  </a-select-option>
                </a-select>
                <!-- <a-select
                  v-else
                  allow-clear
                  v-model="form.classifySmall"
                  placeholder="请选择辅料中类"
                  @focus="getSmall"
                  style="width:100%"
                  @change="changeSmall"
                >
                  <a-select-option
                    :key="form.classifySmall"
                    :value="form.classifySmall"
                  >
                    {{ form.classifySmall }}-{{ form.classifySmallValue }}
                  </a-select-option>
                </a-select> -->
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="辅料小类">
                <a-select v-if="classifyLittleList.length" allow-clear v-model="form.classifyLittle" placeholder="请选择辅料小类"
                  @focus="getLittle" style="width:100%">
                  <a-select-option v-for="(item) in classifyLittleList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else allow-clear v-model="form.classifyLittleValue" placeholder="请选择辅料小类" @focus="getLittle"
                  style="width:100%">
                  <a-select-option v-for="(item) in classifyLittleList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="特殊属性">
                <a-select mode="multiple" v-if="classifyMinimumList.length" v-model="form.classifyMinimumList"
                  placeholder="请选择特殊属性" style="width:100%" @focus="getMin" allow-clear>
                  <a-select-option v-for="(item) in classifyMinimumList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.classifyMinimumValue" placeholder="请选择特殊属性" style="width:100%"
                  @focus="getMin" mode="multiple">
                  <a-select-option v-for="(item) in classifyMinimumList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>

              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="辅料类别" prop="type">
                <a-select v-if="typeList.length" allow-clear v-model="form.type" placeholder="请选择辅料类别"
                  @focus="getDictChildList('ACC_TYPE', 'typeList')" style="width:100%">
                  <a-select-option v-for="(item) in typeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else allow-clear v-model="form.typeValue" placeholder="请选择辅料类别"
                  @focus="getDictChildList('ACC_TYPE', 'typeList')" style="width:100%">
                  <a-select-option v-for="(item) in typeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="底布(带)编号">
                <a-input placeholder="请输入底布(带)编号" v-model="form.baseClothCode" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="颜色属性">
                <a-select v-if="colorAttributeList.length" allow-clear v-model="form.colorAttribute" placeholder="请选择颜色属性"
                  @focus="getDictChildList('COLOR_ATTRIBUTE', 'colorAttributeList')" style="width:100%">
                  <a-select-option v-for="(item) in colorAttributeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else allow-clear v-model="form.colorAttributeValue" placeholder="请选择颜色属性"
                  @focus="getDictChildList('COLOR_ATTRIBUTE', 'colorAttributeList')" style="width:100%">
                  <a-select-option v-for="(item) in colorAttributeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="原辅料编号">
                <a-input placeholder="原辅料编号" v-model="form.oldCode" />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" :xxl="24">
              <a-form-model-item label="辅料名称" :labelCol="{ span: 2 }" :wrapperCol="{ span: 22 }">
                <a-input placeholder="请输入辅料名称" v-model="form.name" />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8" v-if="ifCopy">
              <a-form-model-item label="特殊后缀" prop="specialSuffix">
                <a-select v-if="specialSuffixValueList.length" v-model="form.specialSuffix" placeholder="请选择特殊后缀"
                  style="width:100%" allow-clear
                  @focus="getDictChildList('SPECIAL_SUFFIX_VALUE', 'specialSuffixValueList')">
                  <a-select-option v-for="(item) in specialSuffixValueList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.specialSuffixValue" placeholder="请选择特殊后缀" style="width:100%"
                  @focus="getDictChildList('SPECIAL_SUFFIX_VALUE', 'specialSuffixValueList')">
                  <a-select-option v-for="(item) in specialSuffixValueList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="价格方案" prop="priceProgramme">
                <a-select allow-clear v-if="priceProgrammeList.length" v-model="form.priceProgramme" placeholder="请选择价格方案"
                  style="width:100%" @change="test" @focus="getDictChildList('PRICE_PROGRAMME', 'priceProgrammeList')">
                  <a-select-option v-for="(item) in priceProgrammeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.priceProgrammeValue" placeholder="请选择价格方案" style="width:100%"
                  @change="test" @focus="getDictChildList('PRICE_PROGRAMME', 'priceProgrammeList')">
                  <a-select-option v-for="(item) in priceProgrammeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>

              </a-form-model-item>
            </a-col>

            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="供应类型" prop="supplyType">
                <a-select allow-clear v-if="supplyTypeList.length" v-model="form.supplyType" placeholder="请选择供应类型"
                  style="width:100%" @focus="getDictChildList('SUPPLY_TYPE', 'supplyTypeList')">
                  <a-select-option v-for="(item) in supplyTypeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.supplyTypeValue" placeholder="请选择供应类型" style="width:100%"
                  @focus="getDictChildList('SUPPLY_TYPE', 'supplyTypeList')">
                  <a-select-option v-for="(item) in supplyTypeList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <!-- </a-row>
        <a-row> -->
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="采购单位" prop="purchasingUnit">
                <a-select allow-clear v-if="purchansingUnitList.length" v-model="form.purchasingUnit"
                  placeholder="请选择采购单位" style="width:100%"
                  @focus="getDictChildList('PURCHASING_UNIT', 'purchansingUnitList')">
                  <a-select-option v-for="(item) in purchansingUnitList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.purchasingUnitValue" placeholder="请选择采购单位" style="width:100%"
                  @focus="getDictChildList('PURCHASING_UNIT', 'purchansingUnitList')">
                  <a-select-option v-for="(item) in purchansingUnitList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>

              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="损耗率" prop="wasteRate">
                <a-input type="number" placeholder="请输入损耗率" v-model="form.wasteRate" />
              </a-form-model-item>
            </a-col>

            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="产品年份" prop="productYear">
                <a-select allow-clear v-if="productYearList.length" v-model="form.productYear" placeholder="请选择产品年份"
                  style="width:100%" @focus="getDictChildList('PRODUCT_YEAR', 'productYearList')">
                  <a-select-option v-for="(item) in productYearList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.productYearValue" placeholder="请选择产品年份" style="width:100%"
                  @focus="getDictChildList('PRODUCT_YEAR', 'productYearList')">
                  <a-select-option v-for="(item) in productYearList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>

              </a-form-model-item>
            </a-col>
            <!-- </a-row>
        <a-row> -->
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="上货季" prop="putGoodsSeason">
                <a-select allow-clear v-if="putGoodsSeasonList.length" v-model="form.putGoodsSeason" placeholder="请选择上货季"
                  style="width:100%" @focus="getDictChildList('PUT_GOODS_SEASON', 'putGoodsSeasonList')">
                  <a-select-option v-for="(item) in putGoodsSeasonList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.putGoodsSeasonValue" placeholder="请选择上货季" style="width:100%"
                  @focus="getDictChildList('PUT_GOODS_SEASON', 'putGoodsSeasonList')">
                  <a-select-option v-for="(item) in putGoodsSeasonList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="材质成份" prop="textureComponent">
                <a-input placeholder="请输入材质成份" v-model="form.textureComponent" />
              </a-form-model-item>
            </a-col>

            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="克重" prop="gramWeight">
                <a-input placeholder="请输入克重" v-model="form.gramWeight" />
              </a-form-model-item>
            </a-col>

            <!-- </a-row>
        <a-row> -->
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="缩率" prop="minification">
                <a-input placeholder="请输入缩率" v-model="form.minification" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="门幅段长" prop="widthSegmentLength">
                <a-input placeholder="请输入门幅段长" v-model="form.widthSegmentLength" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="大货周期" prop="bigGoodsCycle">
                <a-input placeholder="请输入大货周期" v-model="form.bigGoodsCycle" />
              </a-form-model-item>
            </a-col>
            <!-- </a-row>
        <a-row> -->
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="快反周期" prop="quickBackCycle">
                <a-input placeholder="请输入快反周期" v-model="form.quickBackCycle" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="粘衬温度" prop="stickLiningTemperature">
                <a-input placeholder="请输入粘衬温度" v-model="form.stickLiningTemperature" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="粘衬时间" prop="stickLiningTime">
                <a-input placeholder="请输入粘衬时间" v-model="form.stickLiningTime" />
              </a-form-model-item>
            </a-col>
            <!-- </a-row>
        <a-row> -->
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="粘衬压力" prop="stickLiningPressure">
                <a-input placeholder="请输入粘衬压力" v-model="form.stickLiningPressure" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="进口产地">
                <a-input placeholder="请输入进口产地" v-model="form.placeOfOrigin" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="原料产地">
                <a-select allow-clear v-model="form.rawMaterialPlace" placeholder="请选择原料产地" style="width:100%">
                  <a-select-option v-for="(item) in environmentalList" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>

          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" :xxl="24">
              <a-form-model-item label="产品特殊说明" prop="specialExplain" :labelCol="{ span: 2 }" :wrapperCol="{ span: 22 }">
                <a-input placeholder="请输入产品特殊说明" v-model="form.specialExplain" type="textarea" />
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉链号型" prop="zipperModel">
                <a-select allow-clear v-if="zipperModelJs.length" v-model="form.zipperModel" placeholder="请选择拉链号型"
                  style="width:100%" @focus="getModel('ZIPPER_MODEL', 'zipperModelJs')">
                  <!-- @focus="getDictChildList('ZIPPER_MODEL_JS', 'zipperModelJs')" -->
                  <a-select-option v-for="(item) in zipperModelJs" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperModelValue" placeholder="请选择拉链号型"
                  @focus="getModel('ZIPPER_MODEL', 'zipperModelJs')" style="width:100%">

                  <!-- @focus="getDictChildList('ZIPPER_MODEL_JS', 'zipperModelJs')" -->
                  <a-select-option v-for="(item) in zipperModelJs" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>

              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉链功能" prop="zipperFunction">
                <a-select allow-clear v-if="zipperFunction.length" v-model="form.zipperFunction" placeholder="请选择拉链功能"
                  style="width:100%" @focus="getDictChildList('ZIPPER_FUNCTION', 'zipperFunction')">
                  <a-select-option v-for="(item) in zipperFunction" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperFunctionValue" placeholder="请选择拉链功能" style="width:100%"
                  @focus="getDictChildList('ZIPPER_FUNCTION', 'zipperFunction')">
                  <a-select-option v-for="(item) in zipperFunction" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉头" prop="zipperHead">
                <a-select allow-clear v-if="zipperHead.length" v-model="form.zipperHead" placeholder="请选择拉头"
                  style="width:100%" @focus="getModel('ZIPPER_HEAD', 'zipperHead')">
                  <a-select-option v-for="(item) in zipperHead" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperHeadValue" placeholder="请选择拉头" style="width:100%"
                  @focus="getModel('ZIPPER_HEAD', 'zipperHead')">
                  <a-select-option v-for="(item) in zipperHead" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉链牙齿" prop="zipperTooth">
                <a-select allow-clear v-if="zipperTooth.length" v-model="form.zipperTooth" placeholder="请选择拉链牙齿"
                  style="width:100%" @focus="getModel('ZIPPER_TOOTH', 'zipperTooth')">
                  <a-select-option v-for="(item) in zipperTooth" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperToothValue" placeholder="请选择拉链牙齿" style="width:100%"
                  @focus="getModel('ZIPPER_TOOTH', 'zipperTooth')">
                  <a-select-option v-for="(item) in zipperTooth" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉链布带" prop="zipperClothBag">
                <a-select allow-clear v-if="zipperClothBag.length" v-model="form.zipperClothBag" placeholder="请选择拉链布带"
                  style="width:100%" @focus="getModel('ZIPPER_CLOTH_BAG', 'zipperClothBag')">
                  <a-select-option v-for="(item) in zipperClothBag" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperClothBagValue" placeholder="请选择拉链布带" style="width:100%"
                  @focus="getModel('ZIPPER_CLOTH_BAG', 'zipperClothBag')">
                  <a-select-option v-for="(item) in zipperClothBag" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="拉链特殊说明" prop="zipperSpecialExplain">
                <a-select allow-clear v-if="zipperSpecialExplain.length" v-model="form.zipperSpecialExplain"
                  placeholder="请选择拉链特殊说明" style="width:100%"
                  @focus="getModel('ZIPPER_SPECIAL_EXPLAIN', 'zipperSpecialExplain')">
                  <a-select-option v-for="(item) in zipperSpecialExplain" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
                <a-select v-else v-model="form.zipperSpecialExplainValue" placeholder="请选择拉链特殊说明" style="width:100%"
                  @focus="getModel('ZIPPER_SPECIAL_EXPLAIN', 'zipperSpecialExplain')">
                  <a-select-option v-for="(item) in zipperSpecialExplain" :key="item.code" :value="item.code">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" :xxl="8">
              <a-form-model-item label="图片">
                <JImageUpload style="display:flex;flex-wrap: wrap;width:100%" :uploadParams="getUploadParams()"
                  :isMultiple="true" :number="5" @fileChange="fileChange" v-model="emptyImg"></JImageUpload>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="产品风险评估">
                <a-input placeholder="产品风险评估，手工输入文本" v-model="form.productRiskAssessment" type="textarea" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="产品推广资料">
                <a-input placeholder="产品推广资料，手工输入文本" v-model="form.productPromotion" type="textarea" />
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="是否推荐">
                <a-radio-group style="margin-left:10px" name="radioGroup" v-model="form.recommendStatus">
                  <a-radio :value="1">
                    是
                  </a-radio>
                  <a-radio :value="0">
                    否
                  </a-radio>
                </a-radio-group>
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="服用功能报告">
                <div style="display:flex;">
                  <a-upload name="file" :multiple="true" :data="formKeyData" :beforeUpload="beforeUpload" :action="getUploadParams().actionUrl" v-model="filePath1"
                :headers="getUploadParams().headers" @change="handleChange" :fileList="fileList1">
                  <a-button> <a-icon type="upload" /> 点击上传 </a-button>
                </a-upload>
                <a-button @click="saveFile(1)" class="saveButton">保存</a-button>
                </div>
                
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="进口产地报告">
                <div style="display:flex;">
                  <a-upload name="file" :multiple="true" :data="formKeyData" :beforeUpload="beforeUpload" :action="getUploadParams().actionUrl" v-model="filePath2"
                :headers="getUploadParams().headers" @change="handleChange1" :fileList="fileList2">
                  <a-button> <a-icon type="upload" /> 点击上传 </a-button>
                </a-upload>
                <a-button @click="saveFile(2)" class="saveButton">保存</a-button>
                </div>
                
              </a-form-model-item>
            </a-col>
            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="8" :xxl="8">
              <a-form-model-item label="原料产地报告">
                <div style="display:flex;">
                  <a-upload name="file" :multiple="true" :data="formKeyData" :beforeUpload="beforeUpload" :action="getUploadParams().actionUrl" v-model="filePath3"
                :headers="getUploadParams().headers" @change="handleChange2" :fileList="fileList3">
                  <a-button> <a-icon type="upload" /> 点击上传 </a-button>
                </a-upload>
                <a-button @click="saveFile(3)" class="saveButton">保存</a-button>
                </div>
                
              </a-form-model-item>
            </a-col>
          </a-row>


        </a-form-model>
      </a-card>
      <a-card>
        <a-tabs :default-active-key="0" v-model="current" @change="changeStep">
          <a-tab-pane :key="0" tab="供应商管理">
          </a-tab-pane>
          <a-tab-pane :key="1" tab="颜色清单">
          </a-tab-pane>
          <a-tab-pane :key="2" tab="规格清单">
          </a-tab-pane>
          <a-tab-pane :tab="item.supplyName + '价格清单'" v-for="item, i in supplyList" :key="i + 3">
          </a-tab-pane>
        </a-tabs>
        <div v-show="current == 0" style="margin-top:10px">
          <a-table bordered :pagination="false" :columns="shop" :data-source="supplyList">
            <span slot="confirmSubmit" slot-scope="txt, record" style="margin-left:5px">
              <span v-if="record.confirmSubmit == 0">
                否
              </span>
              <span v-else>
                是
              </span>
            </span>
            <span slot="defaultStatus" slot-scope="txt, record" style="margin-left:5px">
              <span v-if="record.defaultStatus == 0">
                否
              </span>
              <span v-else>
                是
              </span>
            </span>
            <template slot="action" slot-scope="txt, record,i">
              <a class="mr-10" @click="toSupply(record, i)">
                编辑
              </a>
              <a-popconfirm :title="`确定要删除该项吗?`" @confirm="deleteSupply(i)">
                <a class="mr-10">
                  删除
                </a>
              </a-popconfirm>
              <a class="mr-10" @click="sync(record)" v-if="record.defaultStatus == 0">
                默认
              </a>
              <a class="mr-10" @click="getPrice(record)">
                维护价格
              </a>
            </template>
          </a-table>
          <a-button type="dashed" style="width: 100%;margin-top: 20px;" @click="toSupply('')">
            <a-icon type="plus" />添加供应商
          </a-button>
          <supplyAdd v-if="showSupply" :supplyDetail="supplyDetail" :supplyIndex="supplyIndex" @closeSupply="closeSupply">
          </supplyAdd>
          <priceAdd v-if="showPrice" :priceList="priceList" :supplyCode="supplyCode" :priceProgramme="form.priceProgramme"
            @closePrice="closePrice">
          </priceAdd>

        </div>
        <color v-show="current == 1" :accColorList="accColorList" :supplyList="supplyList" @changeColor="changeColor">
        </color>
        <specs v-show="current == 2" :accSpecsList="accSpecsList" @changespecs="changespecs"></specs>

        <div v-if="current >= 3" style="margin-top:10px">
          <a-table bordered :pagination="false" :columns="columns" :data-source="accPriceList">
          </a-table>
        </div>
      </a-card>
      <!-- <supply :priceList="priceList" :accId="form.accId" @changeSupply="changeSupply" @getPrice="getPrice"></supply> -->


      <copyList @closeCopy="closeCopy" v-if="showCopy"></copyList>
      <printInfo @closePrint="closePrint" :detail="form" :supplyList="supplyList" :colorList="accColorList"
        :specsList="accSpecsList" :printType="printType" v-if="showPrint"></printInfo>
      <a-modal title="打印类型" :visible="showSelect" @ok="handleOk" @cancel="handleCancel">
        <div style="display:flex;justify-content: center;">
          <a-radio-group v-model="printType" button-style="solid">
            <a-radio-button value="a">
              打印A
            </a-radio-button>
            <a-radio-button value="b">
              打印B
            </a-radio-button>
            <a-radio-button value="c">
              打印C
            </a-radio-button>
          </a-radio-group>
        </div>
      </a-modal>
    </div>
  </a-spin>
</template>

<script>
import supply from './supply.vue'
import color from './color.vue'
import specs from './specs.vue'
import copyList from './copy.vue'
import supplyAdd from './supplyAdd.vue'
import priceAdd from './priceAdd.vue'
import printInfo from './print.vue'
import JImageUpload from '@/components/qiniuUpload/JImageUpload.vue'
import globalData from '@/assets/js/common'
import { postAction } from '@/api/manage'
import { axios } from '@/utils/request'

import { saveMaterial, getDictChildList, getDetail, updateMaterial, supplyList, getColorList, specsList, zipperCalc } from '@api/material/index'
import ItemVue from '../../../components/AvatarList/Item.vue'
import { log } from 'mathjs'
import { uploadToken } from '@/api/api'

const shop = [
  {
    title: '供应商编号',
    dataIndex: 'supplyCode'
  },
  {
    title: '供应商简称',
    dataIndex: 'supplyName'
  },
  {
    title: '供应商物料编号',
    dataIndex: 'supplyAccCode'
  },
  {
    title: '供应商物料名称',
    dataIndex: 'supplyAccName'
  },
  {
    title: '确认卡是否提交',
    scopedSlots: { customRender: 'confirmSubmit' }
  },
  {
    title: '默认供应商',
    scopedSlots: { customRender: 'defaultStatus' }
  },
  {
    title: '特殊费用',
    dataIndex: 'specialExpense'
  },
  {
    title: '模具费',
    dataIndex: 'mouldExpense'
  },
  {
    title: '特殊费用备注',
    dataIndex: 'specialExpenseRemark'
  },
  {
    title: '操作',
    width: 220,
    scopedSlots: { customRender: 'action' }
  }
]
const columns = [
  // {
  //   title: '采购价',
  //   dataIndex: 'purchasePrice'
  // },
  {
    title: '税率',
    dataIndex: 'taxRate'
  },
  {
    title: '采购含税价',
    dataIndex: 'purchaseTaxTratePrice'
  },
  {
    title: '调样价',
    dataIndex: 'callSamplePrice'
  }
]
const columns2 = [
  {
    title: '颜色',
    dataIndex: 'colorName'
  },
  {
    title: '规格',
    dataIndex: 'specsName'
  },
  // {
  //   title: '采购价',
  //   dataIndex: 'purchasePrice'
  // },
  {
    title: '税率',
    dataIndex: 'taxRate'
  },
  {
    title: '采购含税价',
    dataIndex: 'purchaseTaxTratePrice'
  },
  {
    title: '调样价',
    dataIndex: 'callSamplePrice'
  }
]
export default {
  components: {
    supply,
    color,
    specs,
    priceAdd,
    supplyAdd,
    JImageUpload,
    copyList,
    printInfo
  },
  data() {
    return {
      token:'',
      formKeyData: {
        token: '',
      },
      filePath1:[],
      filePath2:[],
      filePath3:[],
      fileList1:[],
      fileList2:[],
      fileList3:[],
      classifyBigList: [],
      classifySmallList: [],
      classifyLittleList: [],
      classifyMinimumList: [],
      typeList: [],
      gradeList: [],
      colorAttributeList: [],
      specialSuffixValueList: [],
      priceProgrammeList: [],
      supplyTypeList: [],
      purchansingUnitList: [],
      wasteRateList: [],
      productYearList: [],
      putGoodsSeasonList: [],
      zipperModelJs: [],
      zipperModelNl: [],
      zipperFunction: [],
      zipperTooth: [],
      zipperClothBag: [],
      zipperSpecialExplain: [],
      zipperHead: [],
      environmentalList: [],
      spinning: false,
      taxRate: '',
      current: 0,
      urlKey: 'basemgt-material/',
      form: {
        accColorList: [],
        accSpecsList: [],
        accSupplyList: [],
        bigGoodsCycle: '',
        recommendStatus: 0,
        productRiskAssessment: '',
        productPromotion: '',
        classifyBig: undefined,
        classifyBigValue: '',
        classifyMinimum: '',
        classifyMinimumList: [],
        classifyMinimumValue: [],
        classifySmall: undefined,
        classifySmallValue: '',
        classifyLittle: undefined,
        classifyLittleValue: undefined,
        type: undefined,
        typeValue: '',
        baseClothCode: '',
        colorAttribute: undefined,
        colorAttributeValue: '',
        oldCode: '',
        code: '',
        rawMaterialPlace: undefined,
        gramWeight: '',
        imageList: [],
        jobNumber: '',
        minification: '',
        name: '',
        placeOfOrigin: '',
        priceProgramme: undefined,
        priceProgrammeValue: '',
        productYear: undefined,
        productYearValue: '',
        purchasingUnit: undefined,
        purchasingUnitValue: '',
        putGoodsSeason: undefined,
        putGoodsSeasonValue: '',
        quickBackCycle: '',
        specialExplain: '',
        specialSuffix: undefined,
        specialSuffixValue: '',
        stickLiningPressure: '',
        stickLiningTemperature: '',
        stickLiningTime: '',
        supplyType: undefined,
        supplyTypeValue: '',
        textureComponent: '',
        wasteRate: '',
        widthSegmentLength: '',
        zipperClothBag: undefined,
        zipperClothBagValue: '',
        zipperFunction: undefined,
        zipperFunctionValue: '',
        zipperHead: undefined,
        zipperHeadValue: '',
        zipperModel: undefined,
        zipperModelValue: '',
        zipperSpecialExplain: undefined,
        zipperSpecialExplainValue: '',
        zipperTooth: undefined,
        zipperToothValue: '',
        copyFlag: 0
      },
      rules: {
        classifyBig: [{ required: true, message: '请选择辅料大类', trigger: 'change' }],
        classifySmall: [{ required: true, message: '请选择辅料中类', trigger: 'change' }],
        classifyLittle: [{ required: true, message: '请选择辅料小类', trigger: 'change' }],
        type: [{ required: true, message: '请选择辅料类别', trigger: 'change' }],
        name: [{ required: true, message: '请输入辅料名称', trigger: 'change' }],
        priceProgramme: [{ required: true, message: '请选择价格方案', trigger: 'change' }],
        supplyType: [{ required: true, message: '请选择供应类型', trigger: 'change' }],
        purchasingUnit: [{ required: true, message: '请选择采购单位', trigger: 'change' }],
        wasteRate: [{ required: true, message: '请输入损耗率', trigger: 'change' }],
        putGoodsSeason: [{ required: true, message: '请选择上货季', trigger: 'change' }],
        productYear: [{ required: true, message: '请选择产品年份', trigger: 'change' }],
        textureComponent: [{ required: true, message: '请选择材质成份', trigger: 'change' }]
        // picture: [{ required: true, message: '请上传图片', trigger: 'change' }],
      },
      priceList: [],
      shop,
      supplyList: [],
      showSupply: false,
      showPrice: false,
      showCopy: false,
      loading: false,
      supplyDetail: {},
      supplyIndex: null,
      showPrint: false,
      showSelect: false,
      printType: '',
      priceProgramme: '',
      list: [],
      supplyCode: '',
      columns,
      columns2,
      auth: [],
      ifCopy: false,
      accPriceList: [],
      accColorList: [],
      accSpecsList: [],
      newLifePhotos: [],
      emptyImg: [],
      disabled: false,
      ifChange: false
    }
  },
  watch: {
    accId(newVal, oldVal) {
      if (newVal && newVal !== oldVal) {
        this.loadAccSupply()
      }
    }
  },
  created() { 
    this.fetchUploadToken()

  },
  computed: {
    jobNumber() {
      return this.$store.getters.userInfo.workNo || ''
    }
  },
  mounted() {
    // this.loadData()
    this.getAuth()
    // this.getMin()
    this.getTaxRate()
    this.getGradeList()
    this.getDictChildList('PRODUCT_ORIGIN', 'environmentalList')
    if (this.$route.query.accId) {
      this.loadAcc(this.$route.query.accId)
      this.$nextTick(() => {
        this.loadAccSupply()
        // this.loadAccColor()
        // this.loadAccSpecs()
      })
    }
  },
  methods: {
    getAuth() {
      const params = {
        pageCode: 'acc_edit',
        jobNumber: this.jobNumber
      }
      postAction(`${this.urlKey}account/auth`, params).then(res => {
        if (res.code == 200) {
          this.auth = res.data
        }
      })
    },
    loadData() {
      this.getDictChildList('CLASSIFY_BIG', 'classifyBigList')
      this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList')
      this.getDictChildList('PRODUCT_ORIGIN', 'environmentalList')
      // this.getDictChildList('CLASSIFY_MINIMUM', 'classifyMinimumList')
      // this.getDictChildList('SPECIAL_SUFFIX_VALUE', 'specialSuffixValueList')
      // this.getDictChildList('PRICE_PROGRAMME', 'priceProgrammeList')
      // this.getDictChildList('SUPPLY_TYPE', 'supplyTypeList')
      // this.getDictChildList('PURCHASING_UNIT', 'purchansingUnitList')
      // this.getDictChildList('WASTE_RATE', 'wasteRateList')
      // this.getDictChildList('PRODUCT_YEAR', 'productYearList')
      // this.getDictChildList('PUT_GOODS_SEASON', 'putGoodsSeasonList')
      // this.getDictChildList('ZIPPER_MODEL_JS', 'zipperModelJs')
      // this.getDictChildList('ZIPPER_MODEL_NL', 'zipperModelNl')
      // this.getDictChildList('ZIPPER_FUNCTION', 'zipperFunction')
      // this.getDictChildList('ZIPPER_TOOTH', 'zipperTooth')
      // this.getDictChildList('ZIPPER_CLOTH_BAG', 'zipperClothBag')
      // this.getDictChildList('ZIPPER_SPECIAL_EXPLAIN', 'zipperSpecialExplain')
      // this.getDictChildList('ZIPPER_HEAD', 'zipperHead')
    },
    async getDictChildList(name, list, id) {
      if (!this[list].length || (this[list].length && id)) {
        const params = {
          name: name,
          parentId: id
        }
        try {
          const res = await getDictChildList(params)
          if (res.code == 200) {
            this[list] = res.data
          } else {
            if (res.msg) {
              this.$message.error(res.msg)
            } else {
              this.$message.error('获取数据字典失败！')
            }
          }
        } catch (error) {
          this.$message.error('获取数据字典失败！')
        }
      }
      if (this.form.classifyBig && list == 'classifyBigList') {
        this.classifyBigList.map(item => {
          if (item.code == this.form.classifyBig) {
            this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList', item.id)
          }
        })
      }
    },
    async getGradeList() {
      const params = {
        name: 'CHECK_GRADE',
      }
      try {
        const res = await getDictChildList(params)
        if (res.code == 200) {
          this.gradeList = res.data
          this.$nextTick(() => {
            this.loadAccColor()
            this.loadAccSpecs()
          })
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取过检针等级列表失败！')
          }
        }
      } catch (error) {
        this.$message.error('获取过检针等级列表失败！')
      }
    },
    fetchUploadToken() {
      uploadToken().then(res => {
        if (res.code == 0) {
          this.token = res.data
        } else {
          this.$message.warning(res.msg)
        }
      })
    },
    handleChange(info) {
      let fileList = []
      fileList = info.fileList
      if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败.`)
      } else if (info.file.status === 'done') {
        let list = fileList.map(file => {
          return file
        })
        this.fileList1 = list
        this.filePath1 = list
      }
      this.fileList1 = [...fileList]
      this.filePath1 = [...fileList]
      console.log(this.filePath1);
    },
    handleChange1(info) {
      let fileList = []
      fileList = info.fileList
      if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败.`)
      } else if (info.file.status === 'done') {
        let list = fileList.map(file => {
          return file
        })
        this.fileList2 = list
        this.filePath2 = list
      }
      this.fileList2 = [...fileList]
      this.filePath2 = [...fileList]
    },
    handleChange2(info) {
      let fileList = []
      fileList = info.fileList
      if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} 上传失败.`)
      } else if (info.file.status === 'done') {
        let list = fileList.map(file => {
          return file
        })
        this.fileList3 = list
        this.filePath3 = list
      }
      this.fileList3 = [...fileList]
      this.filePath3 = [...fileList]
    },
    async saveFile(type) {
      const formData = new FormData()
      if (type == 1) {
        this.fileList1.forEach((file) => {
          formData.append(`files`, file.originFileObj);
        });
      } else if (type == 2) {
        this.fileList2.forEach((file) => {
          formData.append(`files`, file.originFileObj);
        });
      } else {
        this.fileList3.forEach((file) => {
          formData.append(`files`, file.originFileObj);
        });
      }
      formData.append('sccode', this.form.code)
      formData.append('type', type)
      formData.append('client', 2)
      const apiBaseUrl = window._CONFIG['domianURL'] || "/jeecg-boot";
      axios({
        url: apiBaseUrl + '/api/gateway/basemgt-material/sample-upload-file/uploadFiles',
        method: 'post',
        data: formData,
        contentType: false,
        cache: false,
        processData: false,//用于对data参数进行序列化处理 这里必须false
        // headers: { 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq' }
      }).then(res => {
        if (res.code == 200) {
          this.$message.success('保存成功')
        } else {
          this.$message.warning(res.msg || '操作失败')
        }
        this.loading = false
      })

    },
    beforeUpload: function (file) {
      new Promise((resolve, reject) => {
        // 支持批量多张上传
        this.formKeyData = {
          // key: key,   // 非必填项，批量上传时不能使用相同key，会导致614报错；不指定key，七牛默认将文件hash作为文件名保存
          token: this.token
        }
        // return isJpgOrPng && isLt2M
        resolve(file)
      })
      // console.log(this.token);
    },
    changeStep(value) {
      if (value > 2) {
        this.accPriceList = this.supplyList[value - 3].accPriceList
      }
      // this.supplyList.map(item => {
      //     if (item.defaultStatus == 1) {
      //       this.accPriceList = item.accPriceList ? item.accPriceList : []
      //     }
      //   })
    },
    changeBig() {
      this.form.classifySmall = undefined
      if (this.form.classifyBig) {
        this.classifyBigList.map(item => {
          if (item.code == this.form.classifyBig) {
            this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList', item.id)
          }
        })
      }
    },
    getSmall() {
      if (this.form.classifyBig) {
        this.classifyBigList.map(item => {
          if (item.code == this.form.classifyBig) {
            this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList', item.id)
          }
        })
      }
      // else {
      //   this.getDictChildList('CLASSIFY_SMALL', 'classifySmallList')
      // }
    },
    getLittle() {
      if (this.form.classifySmall) {
        this.classifySmallList.map(item => {
          if (item.code == this.form.classifySmall) {
            this.getDictChildList('CLASSIFY_LITTLE', 'classifyLittleList', item.id)
          }
        })
      }

    },

    getMin() {
      this.getDictChildList('CLASSIFY_MINIMUM', 'classifyMinimumList')
    },
    getModel(name, list) {
      if (this.form.classifySmall) {
        this.classifySmallList.map(item => {
          if (item.code == this.form.classifySmall) {
            this.getDictChildList(name, list, item.id)
          }
        })
      }
    },
    toPrint() {
      this.showSelect = true
    },
    handleCancel() {
      this.showSelect = false
    },
    handleOk() {
      if (this.printType) {
        this.showSelect = false
        this.showPrint = true
      } else {
        this.$message.warning('请先选择打印类型！')
      }

    },
    closePrint() {
      this.showPrint = false
    },
    changeSmall() {
      // this.form.classifyMinimumList = []
      this.form.zipperModel = undefined
      this.form.classifyLittle = undefined
    },
    getUploadParams() {
      return { ...globalData.uploadParams }
    },
    fileChange(list) {
      const newArr = []
      if (list.length) {
        list.map(item => {
          const obj = {
            url: item.url,
            type: 10
          }
          newArr.push(obj)
        })
      } else {
        this.newLifePhotos = []
      }
      // console.log(this.newLifePhotos);
      this.form.imageList = newArr.length ? newArr : this.newLifePhotos
    },
    changeColor(colorList, key) {
      this.form.accColorList = colorList
      this.accColorList = colorList
      if (key) {
        this.supplyList.map(a => {
          if (a.accPriceList) {
            const newArr = a.accPriceList.filter(item => colorList.some(ele => ele.materialColorId == item.materialColorId))
            a.accPriceList = newArr
          }
        })
        this.supplyList.map(item => {
          if (item.defaultStatus == 1) {
            this.accPriceList = item.accPriceList ? item.accPriceList : []
          }
        })
      } else {
        if (this.form.accId && this.form.priceProgramme == 'SPECS_COLOR') {
          this.supplyList.map(a => {
            if (a.accPriceList) {
              const newArr = colorList.filter(item => !a.accPriceList.some(ele => ele.materialColorId == item.materialColorId))
              newArr.map(b => {
                this.accSpecsList.map(d => {
                  const obj = {
                    colorName: b.colorName,
                    materialColorId: b.materialColorId,
                    materialSpecsId: d.materialSpecsId,
                    taxRate: this.taxRate,
                    specsName: d.name,
                    callSamplePrice: '',
                    // purchasePrice: '',
                    purchaseTaxTratePrice: 0,
                    callSamplePrice: ''
                  }
                  a.accPriceList.push(obj)
                })
              })
            }
          })
        }
      }
      if (this.form.priceProgramme == 'ZIPPER') {
        this.ifChange = true
      }
      // console.log(this.form.accColorList)
    },
    changespecs(specsList, key) {
      this.form.accSpecsList = specsList
      this.accSpecsList = specsList
      if (key) {
        this.supplyList.map(a => {
          if (a.accPriceList) {
            const newArr = a.accPriceList.filter(item => specsList.some(ele => ele.materialSpecsId == item.materialSpecsId))
            a.accPriceList = newArr
          }
        })
        this.supplyList.map(item => {
          if (item.defaultStatus == 1) {
            this.accPriceList = item.accPriceList ? item.accPriceList : []
          }
        })
      } else {
        if (this.form.accId && this.form.priceProgramme == 'SPECS') {
          this.supplyList.map(a => {
            if (a.accPriceList) {
              const newArr = specsList.filter(item => !a.accPriceList.some(ele => ele.materialSpecsId == item.materialSpecsId))
              console.log(newArr)
              newArr.map(b => {
                const obj = {
                  materialSpecsId: b.materialSpecsId,
                  taxRate: this.taxRate,
                  specsName: b.name,
                  callSamplePrice: '',
                  // purchasePrice: '',
                  purchaseTaxTratePrice: 0,
                  callSamplePrice: ''
                }
                a.accPriceList.push(obj)
              })
            }
          })
        }
        if (this.form.accId && this.form.priceProgramme == 'SPECS_COLOR') {
          this.supplyList.map(a => {
            if (a.accPriceList) {
              const newArr = specsList.filter(item => !a.accPriceList.some(ele => ele.materialSpecsId == item.materialSpecsId))
              newArr.map(b => {
                this.accColorList.map(c => {
                  const obj = {
                    colorName: c.colorName,
                    materialColorId: c.materialColorId,
                    materialSpecsId: b.materialSpecsId,
                    taxRate: this.taxRate,
                    specsName: b.name,
                    callSamplePrice: '',
                    // purchasePrice: '',
                    purchaseTaxTratePrice: 0,
                    callSamplePrice: ''
                  }
                  a.accPriceList.push(obj)
                })
              })
            }
          })
        }
      }
      if (this.form.priceProgramme == 'ZIPPER') {
        this.ifChange = true
      }
    },
    changeSupply(supplyList) {
      this.form.accSupplyList = supplyList
      if (this.form.priceProgramme == 'ZIPPER') {
        this.ifChange = true
      }
    },
    toCopy() {
      this.showCopy = true
    },
    closeCopy(id) {
      if (id) {
        this.showCopy = false
        this.ifCopy = true
        this.form.copyFlag = 1
        this.loadAccSupply(id)
        this.loadAccColor(id)
        this.loadAccSpecs(id)
        this.loadAcc(id)
      } else {
        this.showCopy = false

        this.ifCopy = false
      }
    },
    getTaxRate() {
      const params = {
        code: 'acc_tax_rate',
        groupCode: 'flk'
      }
      try {
        postAction(`${this.urlKey}sysParam/info`, params).then(res => {
          if (res.code == 200) {
            this.taxRate = res.data.value
          } else {
            this.$message.warning(res.msg)
          }
        })
      } catch (error) {
        this.$message.warning('获取详情失败！')
      }
    },
    async loadAccSupply(id) {
      try {
        const res = await supplyList({ accId: this.ifCopy ? id : this.$route.query.accId })
        if (res.code == 200) {
          this.supplyList = res.data
          this.supplyList.map(item => {
            item.accPriceList = item.priceList
            if (item.defaultStatus == 1) {
              this.accPriceList = item.priceList
            }
          })
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取供应商列表失败！')
          }
          this.disabled = true
        }
      } catch (error) {
        this.disabled = true
      }
    },
    async loadAccColor(id) {
      try {
        const res = await getColorList({ accId: this.ifCopy ? id : this.$route.query.accId })
        if (res.code == 200) {
          this.accColorList = res.data
          this.colorList = res.data
          this.accColorList.map(item => {
            return (item.supplyPriceScheme = item.supplyPriceSchemeList)
          })
          if (this.accColorList.length) {
            this.accColorList.map((x) => {
              this.gradeList.map((y) => {
                if (x.checkGrade == y.code) {
                  x.checkGradeValue = y.name
                }
              })
            })
          }
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取颜色列表失败！')
          }
          this.disabled = true
        }
      } catch (error) {
        this.disabled = true
      }
    },
    async loadAccSpecs(id) {
      try {
        const res = await specsList({ accId: this.ifCopy ? id : this.$route.query.accId })
        if (res.code == 200) {
          this.accSpecsList = res.data
          this.specsList = res.data
          if (this.accSpecsList.length) {
            this.accSpecsList.map((x) => {
              this.gradeList.map((y) => {
                if (x.checkGrade == y.code) {
                  x.checkGradeValue = y.name
                }
              })
            })
          }
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取规格列表失败！')
          }
          this.disabled = true
        }
      } catch (error) {
        this.disabled = true
      }
    },
    toSupply(record, i) {
      this.showSupply = true
      this.supplyIndex = i
      this.supplyDetail = record
    },
    deleteSupply(i) {
      this.supplyList = this.supplyList.filter((item, index) => index != i)
    },
    closeSupply(values, supplyIndex) {
      if (values) {
        if (this.supplyList.length) {
          if (supplyIndex || supplyIndex === 0) {
            const newArr = this.supplyList.filter(item => item.supplyCode == values.supplyCode)
            if (newArr.length > 1) {
              this.$message.error('该供应商编号已存在，请重新输入！')
            } else {
              this.supplyList.map(item => {
                if (item.defaultStatus == 1 && values.defaultStatus == 1) {
                  item.defaultStatus = 0
                }
              })
              this.supplyList[supplyIndex] = values
              this.showSupply = false
              this.form.accSupplyList = this.supplyList
            }
          } else {
            const newArr = this.supplyList.filter(item => item.supplyCode == values.supplyCode)
            if (newArr.length) {
              this.$message.error('该供应商编号已存在，请重新输入！')
            } else {
              this.supplyList.map(item => {
                if (item.defaultStatus == 1 && values.defaultStatus == 1) {
                  item.defaultStatus = 0
                }
              })
              this.supplyList.push(values)
              this.showSupply = false
              this.form.accSupplyList = this.supplyList
            }
          }
        } else {
          this.supplyList.push(values)
          this.showSupply = false
          this.form.accSupplyList = this.supplyList
        }
        this.supplyList.map(item => {
          if (item.defaultStatus == 1) {
            this.accPriceList = item.accPriceList ? item.accPriceList : []
          }
        })
      } else {
        this.showSupply = false
      }
      if (this.form.priceProgramme == 'ZIPPER') {
        this.ifChange = true
      }
    },

    test() {
      this.form.priceProgrammeValue = ''
      if (this.form.priceProgramme == 'MATERIAL') {
        this.columns = this.columns2.filter(item => {
          return item.dataIndex != 'colorName'
        })
        this.columns = this.columns.filter(item => {
          return item.dataIndex != 'specsName'
        })
      }
      if (this.form.priceProgramme == 'SPECS') {
        this.columns = this.columns2.filter(item => {
          return item.dataIndex != 'colorName'
        })
      }
      if (this.form.priceProgramme == 'SPECS_COLOR' || this.form.priceProgramme == 'ZIPPER') {
        this.columns = this.columns2
      }
      if (this.priceProgramme && this.form.priceProgramme != this.priceProgramme) {
        this.supplyList.map(item => {
          delete item.priceList
          delete item.accPriceList
        })
        this.accPriceList = []
      }
    },
    getPrice(record) {
      this.supplyCode = record.supplyCode
      if (record.accPriceList && record.accPriceList.length && !this.ifChange) {
        this.priceList = record.accPriceList
        this.showPrice = true
      } else {
        if (!this.form.priceProgramme) {
          this.$message.error('请先选择价格方案！')
        } else if (this.form.priceProgramme == 'MATERIAL') {
          const newArr = [
            {
              taxRate: this.taxRate,
              // purchasePrice: '',
              purchaseTaxTratePrice: 0,
              callSamplePrice: ''
            }
          ]
          this.priceList = newArr
          this.showPrice = true
        } else if (this.form.priceProgramme == 'SPECS') {
          const newArr = []
          const specsList = this.accSpecsList
          if (!specsList.length) {
            this.$message.error('请添加规格！')
          } else {
            specsList.map(b => {
              const obj = {
                materialSpecsId: b.materialSpecsId,
                taxRate: this.taxRate,
                specsName: b.name,
                callSamplePrice: '',
                // purchasePrice: '',
                purchaseTaxTratePrice: 0,
                callSamplePrice: ''
              }
              newArr.push(obj)
            })
            this.priceList = newArr
            this.showPrice = true
          }
        } else if (this.form.priceProgramme == 'SPECS_COLOR') {
          const newArr = []
          const colorList = this.accColorList
          const specsList = this.accSpecsList
          if (!specsList.length) {
            this.$message.error('请添加规格！')
          } else if (!colorList.length) {
            this.$message.error('请添加颜色！')
          } else {
            colorList.map(a => {
              specsList.map(b => {
                const obj = {
                  colorName: a.colorName,
                  materialColorId: a.materialColorId,
                  materialSpecsId: b.materialSpecsId,
                  taxRate: this.taxRate,
                  specsName: b.name,
                  callSamplePrice: '',
                  // purchasePrice: '',
                  purchaseTaxTratePrice: 0,
                  callSamplePrice: ''
                }
                newArr.push(obj)
              })
            })
            this.priceList = newArr
            this.showPrice = true
          }
        } else {
          if (!this.accSpecsList.length) {
            this.$message.error('请添加规格！')
          } else if (!this.accColorList.length) {
            this.$message.error('请添加颜色！')
          } else {
            const newArr = []
            const supplyList = this.supplyList
            // console.log(this.accColorList)
            // console.log(supplyList)
            supplyList.map(x => {
              const colorList = []
              this.accColorList.map(y => {
                const obj = {
                  colorName: y.colorName,
                  materialColorId: y.materialColorId,
                  supplyPriceSchemeId: ''
                }
                colorList.push(obj)
                colorList.map(t => {
                  y.supplyPriceScheme.map(z => {
                    if (z.supplyCode == x.supplyCode && y.materialColorId == t.materialColorId) {
                      t.supplyPriceSchemeId = z.supplyPriceSchemeId
                    }
                  })
                })
                x.colorList = colorList
              })
              const specsList = []
              this.accSpecsList.map(item => {
                const obj = {
                  specsName: item.name,
                  materialSpecsId: item.materialSpecsId
                }
                specsList.push(obj)
              })
              const item = {
                supplyCode: x.supplyCode,
                supplyPriceSchemeId: x.supplyPriceSchemeId,
                colorList: x.colorList,
                specsList: specsList
              }
              newArr.push(item)
            })
            this.calculation(newArr)
          }
        }
      }
      this.ifChange = false
    },
    toCalc() {
      if (!this.accSpecsList.length) {
        this.$message.error('请添加规格！')
      } else if (!this.accColorList.length) {
        this.$message.error('请添加颜色！')
      } else {
        const newArr = []
        const supplyList = this.supplyList
        supplyList.map(x => {
          const colorList = []
          this.accColorList.map(y => {
            const obj = {
              colorName: y.colorName,
              materialColorId: y.materialColorId,
              supplyPriceSchemeId: ''
            }
            colorList.push(obj)
            colorList.map(t => {
              y.supplyPriceScheme.map(z => {
                if (z.supplyCode == x.supplyCode && y.materialColorId == t.materialColorId) {
                  t.supplyPriceSchemeId = z.supplyPriceSchemeId
                }
              })
            })
            x.colorList = colorList
          })
          const specsList = []
          this.accSpecsList.map(item => {
            const obj = {
              specsName: item.name,
              materialSpecsId: item.materialSpecsId
            }
            specsList.push(obj)
          })
          const item = {
            supplyCode: x.supplyCode,
            supplyPriceSchemeId: x.supplyPriceSchemeId,
            colorList: x.colorList,
            specsList: specsList
          }
          newArr.push(item)
        })
        this.calculation(newArr, 1)
      }
    },
    async calculation(arr, key) {
      try {
        const res = await zipperCalc({ supplyList: arr })
        if (res.code == 200) {
          this.supplyList.map(y => {
            y.accPriceList = []
            res.data.map(x => {
              if (x.supplyCode == y.supplyCode) {
                y.accPriceList = x.priceList
                y.accPriceList.map(item => {
                  item.callSamplePrice = ''
                })
              }
              if (x.supplyCode == this.supplyCode) {
                this.priceList = x.priceList
                this.priceList.map(item => {
                  item.callSamplePrice = ''
                })
              }
            })
          })
          this.supplyList.map(item => {
            if (item.defaultStatus == 1) {
              this.accPriceList = item.accPriceList
            }
          })
          if (key) {
            this.save()
          } else {
            this.showPrice = true
          }
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('辅料拉链价格计算失败！')
          }
        }
      } catch (error) {
        this.$message.error('辅料拉链价格计算失败！')
      }
    },
    onSubmit() {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          if (this.form.classifyBig == 'L' && !this.form.zipperModel) {
            this.$message.error('请选择拉链号型')
          } else if (this.form.classifyBig == 'L' && !this.form.zipperFunction) {
            this.$message.error('请选择拉链功能')
          } else if (this.form.classifyBig == 'L' && !this.form.zipperHead) {
            this.$message.error('请选择拉头')
          } else if (this.form.classifyBig == 'L' && !this.form.zipperTooth) {
            this.$message.error('请选择拉链牙齿')
          } else if (this.form.classifyBig == 'L' && !this.form.zipperClothBag) {
            this.$message.error('请选择拉链布带')
          } else if (this.form.classifyBig == 'L' && !this.form.zipperSpecialExplain) {
            this.$message.error('请选择拉链特殊说明')
          } else if (!this.supplyList.length) {
            this.$message.error('请选择供应商')
          } else if (this.form.priceProgramme == 'ZIPPER') {
            this.toCalc()
          } else {
            this.save()
          }
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    async save() {
      this.spinning = true
      if (!this.form.accSupplyList) {
        this.form.accSupplyList = this.supplyList
        this.form.accSupplyList.map(item => {
          if (!item.accPriceList || !item.accPriceList.length) {
            item.accPriceList = item.priceList
          }
        })
      }
      if (!this.form.accSpecsList) {
        this.form.accSpecsList = this.accSpecsList
      }
      if (!this.form.accColorList) {
        this.form.accColorList = this.accColorList
      }
      if (this.ifCopy) {
        this.form.copyFlag = 1
        delete this.form.accId
      }
      if (!this.ifCopy && this.form.specialSuffix) {
        this.form.copyFlag = 0
        delete this.form.specialSuffix
      }

      try {
        if (!this.form.classifyBigValue) {
          this.classifyBigList.some(t => {
            if (t.code == this.form.classifyBig) {
              this.form.classifyBigValue = t.name
              return
            }
          })
        }
        if (!this.form.classifySmallValue) {
          this.classifySmallList.some(t => {
            if (t.code == this.form.classifySmall) {
              this.form.classifySmallValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperModelJs.some(t => {
            if (t.code == this.form.zipperModel) {
              this.form.zipperModelValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperHead.some(t => {
            if (t.code == this.form.zipperHead) {
              this.form.zipperHeadValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperFunction.some(t => {
            if (t.code == this.form.zipperFunction) {
              this.form.zipperFunctionValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperTooth.some(t => {
            if (t.code == this.form.zipperTooth) {
              this.form.zipperToothValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperClothBag.some(t => {
            if (t.code == this.form.zipperClothBag) {
              this.form.zipperClothBagValue = t.name
              return
            }
          })
        }
        if (this.form.classifyBig == 'L') {
          this.zipperSpecialExplain.some(t => {
            if (t.code == this.form.zipperSpecialExplain) {
              this.form.zipperSpecialExplainValue = t.name
              return
            }
          })
        }
        if (this.form.classifyMinimumList.length) {
          this.form.classifyMinimum = this.form.classifyMinimumList.toString()
        }
        this.form.jobNumber = this.jobNumber
        let res = null
        if (this.form.accId && !this.ifCopy) {
          res = await updateMaterial(this.form)
        } else {
          res = await saveMaterial(this.form)
        }
        if (res.code == 200) {
          this.$message.success('保存成功！')
          this.spinning = false
          // this.$router.push(`/material/material`)
          if (!this.form.accId) {
            this.form.accId = res.data.accId
          }
          this.$nextTick(() => {
            this.loadAcc(this.form.accId)
          })
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('保存失败！')
          }
          this.spinning = false
        }
      } catch (error) {
        this.spinning = false

        this.$message.error('保存失败！')
      }
    },
    async loadAcc(accId) {
      this.loading = true
      this.emptyImg = []
      try {
        const res = await getDetail({ accId: accId })
        if (res.code == 200) {
          this.form = res.data
          if (res.data.classifyMinimumList.length) {
            const newArr = []
            const newArr1 = []
            res.data.classifyMinimumList.map(item => {
              newArr.push(item.code)
              newArr1.push(item.value)
            })
            this.form.classifyMinimumList = newArr
            this.form.classifyMinimumValue = newArr1

          }
          res.data.imageList.map(item => {
            this.emptyImg.push(item.url)
          })
          this.priceProgramme = res.data.priceProgramme
          if (this.form.priceProgramme == 'MATERIAL') {
            this.columns = this.columns2.filter(item => {
              return item.dataIndex != 'colorName'
            })
            this.columns = this.columns.filter(item => {
              return item.dataIndex != 'specsName'
            })
          }
          if (this.form.priceProgramme == 'SPECS') {
            this.columns = this.columns2.filter(item => {
              return item.dataIndex != 'colorName'
            })
          }
          if (this.form.priceProgramme == 'SPECS_COLOR' || this.form.priceProgramme == 'ZIPPER') {
            this.columns = this.columns2
          }
          this.getDictChildList('CLASSIFY_BIG', 'classifyBigList')
          // if (this.form.classifySmall == 'J') {
          //   this.getDictChildList('ZIPPER_MODEL_JS', 'zipperModelJs')
          // } else if (this.form.classifySmall == 'N') {
          //   this.getDictChildList('ZIPPER_MODEL_NL', 'zipperModelJs')
          // } else if (this.form.classifySmall == 'S') {
          //   this.getDictChildList('ZIPPER_MODEL_SZ', 'zipperModelJs')
          // } else if (this.form.classifySmall == 'M') {
          //   this.getDictChildList('ZIPPER_MODEL_FS', 'zipperModelJs')
          // } else if (this.form.classifySmall == 'Y') {
          //   this.getDictChildList('ZIPPER_MODEL_YX', 'zipperModelJs')
          // }
          this.loading = false
          // this.emptyImg = res.data.imageList
        } else {
          if (res.msg) {
            this.$message.error(res.msg)
          } else {
            this.$message.error('获取详情失败！')
          }
          this.loading = false
          this.disabled = true
        }
      } catch (error) {
        this.loading = false
        this.disabled = true
      }
    },
    sync(values) {
      this.supplyList.map(item => {
        if (item.supplyCode == values.supplyCode) {
          item.defaultStatus = 1
          this.accPriceList = item.accPriceList
        } else {
          item.defaultStatus = 0
        }
      })
    },
    closePrice(supplyCode, list) {
      this.showPrice = false
      if (list) {
        this.supplyList.map(item => {
          if (item.supplyCode == supplyCode) {
            item.accPriceList = list
            if (item.defaultStatus == 1) {
              this.accPriceList = list
            }
          }
        })
        this.form.accSupplyList = this.supplyList
      }
    }
  }
}
</script>
<style>
.tableHiddle {
  display: none;
}

.tableShow {
  display: revert;
}
</style>
<style scoped>
.saveButton{
  position: relative;
    top: 3px;
    left: 5px;
}
</style>